<template>
  <div class="rightBodyContent">
    <div class="rightBodyContent-in">
      <div class="search-list mb-10">
        <div style="display: flex;align-items: center;margin-right: 10px">
          <el-date-picker
              v-model="searchBox.start_time"
              type="date"
              placeholder="选择日期"
              value-format="yyyy-MM-dd"
              size="small"
              class="w-140"
              :picker-options="pickerOptions1"
          ></el-date-picker>
          <el-button type="primary" size="small" @click="searchFn('search')" class="ml-10">搜索
          </el-button>
          <el-button size="small" @click="searchFn('refresh')">重置刷新</el-button>
          <el-button type="primary" size="small" @click="weekVisible=true" class="ml-10" plain>餐品安全排查项目管理
          </el-button>
          <el-button type="primary" size="small" @click="daycheckData=null,codeVisible=true" class="ml-10" plain>检查二维码
          </el-button>
        </div>
      </div>
      <!--本体列表，数据 -->
      <el-table
          ref="multipleTable"
          :data="arryList"
          :stripe="tableStripe"
          :border="tableBorder"
          tooltip-effect="dark"
          header-cell-class-name="table-text-c"
          cell-class-name="table-text-c">
<!--        <el-table-column-->
<!--            align="center"-->
<!--            prop="id"-->
<!--            label="ID"-->
<!--            width="50">-->
<!--        </el-table-column>-->
        <el-table-column
            align="center"
            prop="create_time"
            label="检查日期">
        </el-table-column>
        <el-table-column
            align="center"
            prop="timeNumber"
            label="校周">
          <template slot-scope="scope">
            第{{scope.row.week}}周
          </template>
        </el-table-column>
        <el-table-column
            align="center"
            label="检查人">
          <template slot-scope="scope">
            {{scope.row.user?scope.row.user.realname:''}}
          </template>
        </el-table-column>
        <el-table-column
            width="250"
            align="center"
            label="操作">
          <template slot-scope="scope">
            <el-button size="mini" plain @click="detailId=scope.row.id,iframeVisible=true">
              食品安全排查表
            </el-button>
<!--            <el-button size="mini" plain @click="daycheckData=scope.row,codeVisible=true">-->
<!--              当周检查二维码-->
<!--            </el-button>-->
          </template>
        </el-table-column>
      </el-table>
      <!--工具条 分页-->
      <el-col :span="24" class="toolbar">
        <el-pagination
            background
            :page-size="page.pagesize"
            :current-page="page.pageindex"
            layout="total, prev, pager, next"
            :total="page.total"
            @current-change="handleSizeChange"></el-pagination>
      </el-col>
      <div class="height40"></div>
      <weekTable :visible.sync="weekVisible"></weekTable>
      <codeCheck :visible.sync="codeVisible" codeType="1" :daycheckData="daycheckData"></codeCheck>
      <printIframe :visible.sync="iframeVisible" printType="1" :detailId="detailId"></printIframe>
    </div>
  </div>
</template>

<script>
import {pagination} from '@/utils/util.js'
import {foodCheckWeekNow} from "@/api/admin/schoolFood"
import weekTable from "../components/week-table"
import codeCheck from "../components/codeCheck";
import printIframe from "../components/printIframe";

export default {
  components: {weekTable, codeCheck, printIframe},
  data() {
    return {
      iframeVisible: false,
      codeVisible: false,
      weekVisible: false,
      tableStripe: true, // 是否斑马栏
      tableBorder: true, // 单元格右边边框
      arryList: [{
        id: 101,
        time: '2023-02-23至2023-03-06',
        userName: '小李',
        timeNumber: '第4周'
      }], // 数据列表
      // 页数
      page: {
        pageindex: pagination.pageIndex,
        pagesize: pagination.pageSize,
        total: pagination.total
      },
      searchBox: {
        start_time: '',
      },
      pickerOptions1: {
        disabledDate(time) {
          return time.getTime() > Date.now() //  - 8.64e7
        }
      },
      detailId: 0,
      daycheckData: null
    }
  },
  watch: {},
  created() {
    this.InitFn()
  },
  methods: {
    // 初始化
    async InitFn() {
      let option_ = JSON.parse(JSON.stringify(this.searchBox))
      option_.p = this.page.pageindex
      foodCheckWeekNow(option_).then(res => {
        this.arryList = res.list.data;
        this.page.total = res.list.total;
      })
    },
    searchFn(option) {
      if (option === 'refresh') {
        this.searchBox.start_time = ''
      }
      this.page.pageindex = 1;
      this.InitFn()
    },
    // 分页
    handleSizeChange(val) {
      this.page.pageindex = val
      this.InitFn()
    },
    deletefn(row) {
      this.$confirm('确认删除该学生健康记录, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.detelCalss(row.id)
      }).catch(() => {
      })
    },
    async detelCalss(id) {
      dayCheckDelete({id: id}).then(res => {
        console.log('res:', res)
        if (!res.code) {
          this.$message.success(res.msg)
          this.InitFn()
        } else {
          this.$message.error(res.msg)
        }
      })
    },
  },
  mounted() {
  },
}
</script>
<style>
</style>

